<template>
  <div class="guns-body">
    <!-- 搜索表单 -->
    <div class="block-interval">
      <a-card :bordered="false">
        <a-form layout="inline" :model="where">
          <a-row>
            <!-- <a-form-item label="开始时间:">
              <a-date-picker
                v-model:value="where.beginTime"
                format="YYYY-MM-DD"
                valueFormat="YYYY-MM-DD"
              />
            </a-form-item>
            <a-form-item label="结束时间:">
              <a-date-picker
                v-model:value="where.endTime"
                format="YYYY-MM-DD"
                valueFormat="YYYY-MM-DD"
              />
            </a-form-item> -->

            <!-- 
            <a-form-item label="标签分类">
              <a-tree-select v-model:value="where.tagStyleNo" style="width: 200px" :tree-data="leafData"
                :tree-data-simple-mode="false" tree-node-filter-prop="disabled"
                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" placeholder="请选择上级机构" :fieldNames="{
                  children: 'children',
                  label: 'name',
                  key: 'tagStyleNo',
                  value: 'tagStyleNo',
                }" allow-clear />
            </a-form-item> 
            -->

            <a-form-item label="用户ID:">
              <a-input v-model:value.trim="where.custNo" placeholder="用户ID" allow-clear />
            </a-form-item>

            <a-form-item label="智能体ID:">
              <a-input v-model:value.trim="where.agentNo" placeholder="智能体ID" allow-clear />
            </a-form-item>

            <!-- <a-form-item label="权限:">
              <a-select
                ref="select"
                v-model:value="where.invisible"
                style="width: 120px"
                :options="optionsInvisible"
              ></a-select>
            </a-form-item>
            <a-form-item label="状态:">
              <a-select
                ref="select"
                v-model:value="where.status"
                style="width: 120px"
                :options="options"
              ></a-select>
            </a-form-item> -->

            <a-form-item class="ele-text-center">
              <a-space>
                <a-button type="primary" @click="reload">查询</a-button>
                <a-button @click="reset">重置</a-button>
              </a-space>
            </a-form-item>
          </a-row>
        </a-form>
      </a-card>
    </div>

    <!-- 表格 -->
    <div>
      <a-card :bordered="false" class="table-height">
        <BasicTable :canResize="false" ref="tableRef" :api="AiAgentApi.findPage" :where="where" :columns="columns"
          showTableSetting rowKey="agentNo" :rowSelection="{
            type: 'checkbox',
            selectedRowKeys: checkedKeys,
          }">
          <!-- table上边工具栏 -->
          <template #toolbar>
            <div class="table-toolbar"> </div>
          </template>

          <template #bodyCell="{ column, record }">
            <template v-if="column.dataIndex == 'nickName'">
              <a @click="openDetail(record)">{{ record.nickName }}</a>
            </template>
            <template v-if="column.dataIndex == 'invisible'">
              <a-tag v-if="record.invisible === 'N'">隐身</a-tag>
              <a-tag color="green" v-else>公开</a-tag>
            </template>
            <template v-if="column.dataIndex == 'status'">
              <a-tag v-if="record.status === 'S'" color="red">驳回</a-tag>
              <a-tag v-else-if="record.status === 'Y'" color="green">通过</a-tag>
              <a-tag v-else color="#87d068"> 待审核</a-tag>
            </template>
          </template>
        </BasicTable>
      </a-card>
    </div>

    <!-- 操作日志详情 -->
    <ai-agent-detail v-model:visible="showDetail" :detail="current" @reload="reload" />
  </div>
</template>

<script lang="ts" setup>
import { reactive, ref, onMounted } from 'vue';
import { BasicTable } from '/@/components/Table';
import { AiAgentApi } from '/@/api/touch/aiAgent/AiAgentApi';
import AiAgentDetail from './aiAgent-detail.vue';
import { TagStyleInfoApi } from '/@/api/touch/tagStyle/TagStyleInfoApi';

// 查询条件
const where = reactive({
  beginTime: '',
  endTime: '',
  custNo: '',
  agentNo: '',
  status: '###',
  tagStyleNo: '',
});

const options = ref<SelectProps['options']>([
  {
    value: '',
    label: '请选择',
  },
  {
    value: 'N',
    label: '待审核',
  },
  {
    value: 'Y',
    label: '通过',
  },
]);
const optionsInvisible = ref<SelectProps['options']>([
  {
    value: '',
    label: '请选择',
  },

  {
    value: 'N',
    label: '隐身',
  },
  {
    value: 'Y',
    label: '公开',
  },
]);
// 表格配置
const columns = ref<string[]>([
  {
    title: '创建时间',
    dataIndex: 'createTime',
  },
  {
    title: '创建用户ID',
    dataIndex: 'custNo',
  },
  {
    title: '智能体ID',
    dataIndex: 'agentNo',
  },
  {
    title: '智能体名称',
    dataIndex: 'nickName',
  },
  {
    title: '权限',
    dataIndex: 'invisible',
    customRender: function ({ text }) {
      if ('N' === text) {
        return '隐身';
      } else {
        return '公开';
      }
    },
  },
  {
    title: '审核时间',
    dataIndex: 'createTime',
  },
  {
    title: '审核结果',
    dataIndex: 'approvalOpinion',
  },
  {
    title: '审批人',
    dataIndex: 'approvalUserName',
  },
  {
    title: '审核',
    dataIndex: 'status',
  },
]);
const leafData = ref<any>([]);
const orgLists = ref<any>([]);
onMounted(async () => {
  const disableNotLeaf = 'Y';
  orgLists.value = await TagStyleInfoApi.tree({ disableNotLeaf });

  leafData.value = getleftNodes(orgLists.value)

});
const getleftNodes = (data) => {
  return data.reduce((acc, node) => {
    if (node.children && node.children.length > 0) {
      acc.push(...node.children)
    }
    return acc
  }, [])
}



/**
 * 审批
 *
 */
// 多选选中列表
const checkedKeys = ref<Array<string | number>>([]);

// 当前行数据
const current = ref<any>(null);

// 是否显示详情弹框
const showDetail = ref<boolean>(false);

// ref
const tableRef = ref(null);

/**
 * 点击查询
 * @author: nxy
 * @Date: 2022-10-12 09:38:18
 */
const reload = () => {
  checkedKeys.value = [];
  tableRef.value.reload({ page: 1 });
};

/**
 * 点击重置
 * @author: nxy
 * @Date: 2022-10-12 09:38:29
 */
const reset = () => {
  where.beginTime = '';
  where.endTime = '';
  where.nickName = '';
  where.tagStyleNo = '';
  where.status = '###',
    where.agentNo = '';
  where.custNo = '';
  where.invisible = '';
  reload();
};

/**
 * 打开详情窗口
 *
 * @author fengshuonan
 * @date 2021/4/2 17:03
 */
const openDetail = async (row: any) => {
  current.value = await AiAgentApi.detail({ agentNo: row.agentNo });

  if (current.value === null) {
    current.value = row

  }
  showDetail.value = true;
};
</script>
